<template>
  <div>
    <van-nav-bar
      fixed
      :title="title"
      left-arrow
      @click-left="$utils.back($route.path);"
    />
    <div class="has-top ">
      <div class="priceTop">
        <div class="num fw-b"><span class="fs-48">¥</span><span class="fs-70">{{data.TotalMoney}}</span></div>
        <div class="fs-28" style="color: #666;">收款金额</div>
      </div>
      <div class="payList">
        <div class="paytitle">请选择邀请客户支付方式</div>
        <div class="bg-white">
          <van-radio-group v-model="radio">
            <van-cell-group>
              <van-cell @click="radio = '1'" v-if="paytypelist.indexOf('0') > -1">
                <template #title>
                  <img src="@/assets/images/pay/pay1.png" style="width: 24px; height: 24px; margin-right: 5px;"><span class="pt-5">现金收款</span>
                </template>
                <van-radio slot="right-icon" checked-color="#EF1F1F" name="1" />
              </van-cell>
              <van-cell @click="radio = '2'" v-if="paytypelist.indexOf('2') > -1">
                <template #title>
                  <img src="@/assets/images/pay/pay2.png" style="width: 24px; height: 24px; margin-right: 5px;"><span class="pt-5">余额支付</span>
                </template>
                <van-radio slot="right-icon" checked-color="#EF1F1F" name="2" />
              </van-cell>
              <van-cell @click="radio = '3'">
                <template #title>
                  <img src="@/assets/images/pay/wechatfriend.png" style="width: 24px; height: 24px; margin-right: 5px;"><span class="pt-5">微信收款</span>
                </template>
                <van-radio slot="right-icon" checked-color="#EF1F1F" name="3" />
              </van-cell>
              <!-- <van-cell @click="radio = '4'" v-if="paymentShow && paytypelist.indexOf('1') > -1">
                <template #title>
                  <img src="@/assets/images/pay/pay4.png" style="width: 24px; height: 24px; margin-right: 5px;"><span class="pt-5">线下支付</span>
                </template>
                <van-radio slot="right-icon" checked-color="#EF1F1F" name="4" />
              </van-cell> -->
            </van-cell-group>
          </van-radio-group>
          <div class="pd-24">
            <van-button type="danger" class="bor-ra" size="large" @click="submit">确定</van-button>
          </div>
        </div>
      </div>
    </div>
    <van-dialog v-model="xianjin" title="温馨提示" show-cancel-button closeable cancel-button-text="取消" confirm-button-text="确定" close-on-click-overlay @confirm="save">
      <div class="tipcontent pt-40 pb-40" style="text-align:center">
					<div class="price fs-50 fw-b"><span>￥</span>{{data.TotalMoney}}</div>
					<div class="fs-28">现金收款金额</div>
				</div>
	</van-dialog>
  <van-dialog v-model="balance" title="温馨提示" show-cancel-button closeable cancel-button-text="取消" confirm-button-text="确定" close-on-click-overlay @confirm="balancesave">
      <div class="tipcontent pt-40 pb-40" style="text-align:center">
					<div class="price fs-50 fw-b"><span>￥</span>{{data.TotalMoney}}</div>
					<div class="fs-28">余额收款金额</div>
				</div>
	</van-dialog>
  <van-dialog v-model="wxpay" title="温馨提示" show-cancel-button closeable cancel-button-text="取消" confirm-button-text="确定" close-on-click-overlay @confirm="wxpaysave">
      <div class="tipcontent pt-40 pb-40" style="text-align:center">
					<div class="price fs-50 fw-b">
            <img :src="qcode" style="width: 320px; height: 320px; margin-bottom: 15px;">
          </div>
					<div class="fs-28">扫码支付</div>
				</div>
	</van-dialog>
  </div>
</template>

<script>
import contentSearch from 'components/contentSearch'
import noData from 'components/noData'
import productList from 'components/productList'
import datetimeFilter from 'components/datetimeFilter'
import { GetWriteoffRecordPage } from 'api/writeoff'
import { GetUserPageFromStore, GetStoreMemberTotal } from 'api/member'

import imgBox from 'components/imgBox'
import { 		GetCashierLog,
		UseScanQRPay,
		GetOrUpdatePayUser,
		GetCouponUpdatePayUser,
		UseCashPay,
		GetBankList,
		GetFillOrderPayType} from 'api/cashier'
import { getInitWebInfo} from 'api/web'
import { GetMiniAppPayData} from 'api/weChat'
import {
		GetBusinessFunction
	} from "api/businessSetting.js"
export default {
  components: {
    contentSearch,
    noData,
    productList,
    datetimeFilter,
    imgBox
  },
  data() {
    return {
      bgWhite: true,
      searchVal: '',
      // 时间选择框显示
      timeStartSelect: false,
      timeEndSelect: false,

      GetWriteoffRecordPageRequest: {
        PageIndex: 1,
        PageSize: 10,
      },

      // 记录列表
      productList: [],

      // 滚动状态
      totalAmout: 0,
      scollRequest: true,
      end: false,
			title: '支付订单',
			type: 0,
      radio:'1',
      tradeno:'',
      data:{},
				paymentShow:false,
				userNumber: '',
				fromtype:null,
				domain:'',
				webinfo:{},
				payTicksTime:null,
				paytypelist:'',
				Userinfo:{},
				switchnum:1,
        xianjin:false,
        balance:false,
        wxpay:false,
        baseURL:'',
        payData:{},
        qcode:''
    }
  },
  created() {
      this.tradeno = this.$route.query.tradeno
      this.payData = JSON.parse(this.$route.query.data);
      console.log(this.payData)
      let _baseURL = process.env.VUE_APP_BASE_API
      if (process.env.NODE_ENV === 'production' && BASE_URL) {
        _baseURL = BASE_URL
      }
      this.baseURL = _baseURL
      this.getinfo()
      this.getwebinfo()
			this.GetPayType()
			this.getPayList()
			this.GetBusiness()
  },
  mounted() {

  },
  methods: {
    getBaseUrl() {
        let _baseURL = process.env.VUE_APP_BASE_API
        if (process.env.NODE_ENV === 'production' && BASE_URL) {
          _baseURL = BASE_URL
        }
        return _baseURL
      },
    getinfo() {
      let path = '?tradeno=' + this.tradeno + '&status=1'
      GetCashierLog({tradeno:this.tradeno,status:1}).then(res => {
        console.log(res)
        if (res.State == 1) {
          this.data = res.Data;
          if(res.Data.PayUserId !=0){
            // this.GetPayUser();
          }
        }
      })
    },
    getwebinfo(){
      let path = '?domain=' + this.$LocalDomain
      getInitWebInfo(path).then(res => {
        if (res.State == 1) {
          this.webinfo = res.Data
        }
      })
    },
    GetPayType(){
      GetFillOrderPayType().then(res => {
        if (res.State==1) {
          this.paytypelist = res.Data
        } else {
          this.$toast(res.Msg)
        }
      })
    },
    getPayList(){
      let path = '?tradeNo='+this.tradeno
      GetBankList({tradeno:this.tradeno}).then(res => {
        if (res.State==1) {
          if(res.Data.length > 0){
            this.paymentShow = true
          }
        } else {
          this.$toast(res.Msg)
        }
      })
    },
    GetBusiness(){
      let path = '53'
      GetBusinessFunction(path).then(res => {
        if (res.State==1) {
          this.switchnum = res.Data[0].Value
        } else {
          this.$toast(res.Msg)
          
        }
      })
    },
    wexinPay(){
        let BusinessId = this.webinfo.BusinessId
				let notify_url = this.baseURL + "/Notify/OrderPay/" + BusinessId
				let tip = "订单支付"
				let payParam = {
				    tip: tip,
				    orderSn: this.payData.Sn,
				    paySn: this.payData.OutTradeNo,
				    money: this.payData.PayMoney,
				    notifyUrl: notify_url,
				    payWay: 13,
				    businessId: BusinessId,
				}
      GetMiniAppPayData(payParam).then(res => {
        if (res.State==1) {
          if(res.Data.status){
							this.qcode = res.Data.url
              this.wxpay = true

						}else{
							this.$toast(res.Data.Msg)
						}
        } else {
          this.$toast(res.Msg)
          
        }
      })
    },
    wxpaysave(){
      this.wxpay = false
    },
    submit(){
      if(this.radio=="1"){
        this.xianjin = true
      }
      if(this.radio=="2"){
        this.balance = true
      }
      if(this.radio=="3"){
        this.wexinPay()
      }
    },
    save() {
      var that = this
      this.$toast.loading({
        message: '正在验证...',
      })
      let path = '?tradeNo=' + this.tradeno + '&totalMoney=' + this.data.TotalMoney
      UseCashPay({tradeNo:this.tradeno,totalMoney:this.data.TotalMoney}).then(res => {
        this.$toast.clear()
        if (res.State == 1) {
          this.$toast('收款成功')
        
            //去订单成功页
            setTimeout(e => {
              this.$router.replace({
                path: '/paySucceed?orderId='+this.data.RelationId
              })
            }, 1000)
          
            // setTimeout(e => {
            //   this.$router.go(-1);
            // }, 1000)
          
        } else {
          this.$toast(res.Msg);
        }
      })
    },
    balancesave(){
      let that = this;
      this.$toast.loading({
        message: '正在验证...',
      })
      let path = '?tradeNo=' + this.tradeno + "&totpWord=''&userId="+this.data.PayUserId
      UseScanQRPay({tradeNo:this.tradeno,totpWord:'',userId:this.data.PayUserId}).then(res => {
        this.$toast.clear()
        console.log(res)
        if (res.State == 1) {
          this.$toast("收款成功！收款金额：" + this.data.TotalMoney + "元");
            //去订单成功页
            setTimeout(e => {
               this.$router.replace({
                path: '/paySucceed?orderId='+this.data.RelationId
              })
            }, 1000)
        } else {
          this.$toast(res.Msg);
        }
      })
    },
    payment(){
				//跳转线下支付页
		},

 

  }
}
</script>
<style lang="scss" scoped>
.van-hairline--bottom::after{
  border-bottom-width:0;
}
.color-red{
  color: #F1270C;
}
.tag{
  width: 64px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  background: #FFF2F0;
  color: #F1270C;
  border-radius: 4px;

}
.priceTop{
  margin: 120px auto 36px auto;
  text-align: center;
}
.payList{
  margin: 0 24px;
  .paytitle{
    height: 96px;
    line-height: 96px;
    background: linear-gradient( 270deg, #FFFBFB 0%, #FFF3F3 100%);
    border-radius: 24px 24px 0px 0px;
    font-size: 32px;
    color: #1E1E1E;
    padding-left: 34px;
  }
}
.bor-ra{
    height: 88px;
    background: #EF1F1F;
    border-radius: 44px;
    border: 1px solid #EF1F1F;

  }
</style>
